<template>
  <el-row class="tac">
    <el-col>
      <el-menu :default-active="$route.path"
               class="el-menu-vertical-demo"
               @open="handleOpen"
               :router="true"
               @close="handleClose">
        <el-menu-item v-for="menu  in  menuList"
                      :index="menu.path"
                      :key="menu.name"
                      :disabled="menu.disabled">
          <span slot="title">{{menu.title}}</span>
        </el-menu-item>

      </el-menu>
    </el-col>
  </el-row>
</template>

<script>
export default {
  props: {
  },
  data () {
    return {
      activeIndex: 'Business',
      menuList: [
        {
          name: 'Channel',//对应index
          title: '渠道管理',
          path: '/Settings/Channel',
          disabled: true,

        },
        {
          name: 'Accommodation',//对应index
          title: '住宿设置',
          path: '/Settings/Accommodation',
          disabled: true,
        },
        {
          name: 'RoomTypeSetting',//对应index
          title: '房型房间设置',
          path: '/Settings/RoomTypeSetting',
        },
        {
          name: 'RoomGroupingSetting',//对应index
          title: '房间分组设置',
          path: '/Settings/RoomGroupingSetting',
        },
        {
          name: 'SortingSetting',//对应index
          title: '排序设置',
          path: '/Settings/SortingSetting',
        },
        {
          name: 'ConsumptionSetting',//对应index
          title: '消费项设置',
          path: '/Settings/ConsumptionSetting',
        },
        {
          name: 'HourRoomSetting',//对应index
          title: '钟点房设置',
          path: '/Settings/HourRoomSetting',
        },
        {
          name: 'RoomPriceSetting',//对应index
          title: '房价设置',
          path: '/Settings/RoomPriceSetting',
        },
        {
          name: 'BatchSetting',//对应index
          title: '批量设置',
          path: '/Settings/BatchSetting',
        },
        {
          name: 'ChangePriceRecord',//对应index
          title: '改价设置',
          path: '/Settings/ChangePriceRecord',
        },
        {
          name: 'AccountManage',//对应index
          title: '账户管理',
          path: '/Settings/AccountManage',
        },
        {
          name: 'ListAccount',//对应index
          title: '账号列表',
          path: '/Settings/ListAccount',
        },
        {
          name: 'MessagesManage',//对应index
          title: '短信管理',
          path: '/Settings/MessagesManage',
        },
        {
          name: 'MessagesBalance',//对应index
          title: '短信余额',
          path: '/Settings/MessagesBalance',
        },
        {
          name: 'AutoMessages',//对应index
          title: '自动短信',
          path: '/Settings/AutoMessages',
        },
        {
          name: 'SendMessages',//对应index
          title: '发送短信',
          path: '/Settings/SendMessages',
        },
        {
          name: 'FinanceSetting',//对应index
          title: '财务设置',
          path: '/Settings/FinanceSetting',
          disabled: true,
        },
        {
          name: ' PaymentMethodSetting',//对应index
          title: '收款方式设置',
          path: '/Settings/PaymentMethodSetting',
        }
      ]

    }
  },
  methods: {
    clickMenu () {
      console.log("点击了");
    },
    handleOpen (key, keyPath) {
      console.log(key, keyPath)
    },
    handleClose (key, keyPath) {
      console.log(key, keyPath)
    },
  }
}
</script>

<style lang="scss" scoped>
.tac {
  ::v-deep .el-menu {
    position: fixed;
    height: 100%;
    width: 150px;
  }
}
</style>